<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:pm="http://www.pragmindz.org/jsf">

<head>
    <title>Employee</title>
    <base href="http://localhost:8080/blockinput-example/"/>
    <script type="text/javascript" src="js/blockinput.js"/>
    <script type="text/javascript">
        function myCallBack(success, input)
        {
            if (!success)
                document.getElementById("acctStatus").value = "Pattern match failed !";
            else
            {
                var account = parseInt(input.substr(0, 10));
                var check = parseInt(input.substr(10, 2));
                var rest = account % 97;
                if (rest == 0) rest = 97;
                if (rest == check)
                    document.getElementById("acctStatus").value = "Good job !";
                else
                    document.getElementById("acctStatus").value = "Invalid account number !";
            }
        }

        function mycellCB(code,input)
        {
            return code.toUpperCase();
        }
    </script>
</head>

<body>
    <h:form id="empForm">
        <h:panelGrid columns="2">
            <h:outputText value="Firstname : "/>
            <pm:bi size="20" value="#{emp.firstName}"/>
            <h:outputText value="Lastname :"/>
            <pm:bi id="ln" size="20" value="#{emp.lastName}"/>
            <h:outputText value="Phone : "/>
            <pm:bi id="pn" value="#{emp.phoneNumber}" mask="(XXX)XXX-XXXX" filter="[\\d]{10}"/>
            <h:outputText value="Email : "/>
            <pm:bi id="em" value="#{emp.email}" size="20" cellCallback="mycellCB"/>
            <h:outputText value="Employee since : "/>
            <pm:bi id="hd" value="#{emp.hireDate}" mask="XX/XX/XXXX" filter="[\\d]{8}">
                <f:convertDateTime pattern="ddMMyyyy"/>
            </pm:bi>
            <h:outputText value="Bankaccount : "/>
            <h:panelGrid columns="3">
                <pm:bi id="bankAccount" size="10" styleClass="fullBorder" value="#{emp.bankAccount}" mask="XXX-XXXXXXX-XX"
                   filter="[\d]{12}" callback="myCallBack" cellCallback="mycellCB"/>
                <input type="button" value="Reset" onclick="pm$bi.reset('bankAccount')"/>
                <input type="text" disabled="disabled" id="acctStatus" style="width:20em"/>
            </h:panelGrid>
        </h:panelGrid>
        <br/>
        <h:commandButton action="#{empHandler.save}" value="Save"/>
    </h:form>
</body>
</html>
